const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const { CleanWebpackPlugin } = require('clean-webpack-plugin')
let CopyWebpackPlugin = require('copy-webpack-plugin')
let webpack = require('webpack')
module.exports = {
  mode: 'production',
  // 多入口
  entry: {
    index: './src/index.js',
  },
  output: {
    // [name] home, other
    filename: '[name].[hash].js',
    path: path.resolve(__dirname, 'dist')
  },
  resolve: { // 解析 第三方 common
    modules: [path.resolve('node_modules')], // 缩小模块查找范围
    extensions: ['.js', '.css', '.json'], // 先找js 没有 就找css 再找json
    mainFields: ['style', 'main'], // 配置入口(package.json)
    // mainFiles: [], // 入口文件的名字 默认index
    alias: { // 别名 vue.runtime
      // 'bootstrap': 'bootstrap/dist/css/bootstrap.css'
    }

  },
  devServer: {
    before (app) {
      app.get('/user', (req, res) => {
        res.json({
          name: 'gzt-before'
        })
      })
    }
    // proxy: { // 重写的方式 把请求代理到服务器上
    //   "/api/**": {
    //     target: "http://localhost:3000/",
    //     pathRewrite: { "^/api": "" }
    //   }
    // }
  },
  watch: true,
  watchOptions: { // 监控的选项
    poll: 1000, // 每秒问我1000次
    aggregateTimeout: 500, // 防抖 我一直输入代码 500ms内我输入的只打包一次
    ignored: '/node_module'
  },
  devtool: 'eval-cheap-module-source-map', // 增加映射文件 可以帮我们调试源码
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader']
      },
      {
        test: /\.js$/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['@babel/preset-env']
          }
        }
      }
    ]
  },
  plugins: [
    new webpack.DefinePlugin({
      DEV: JSON.stringify('production'),
      FLAG: 'true',
      EXPRESSION: '1 + 1'
    }),
    new webpack.BannerPlugin({
      entryOnly: true,
      banner: 'gzt 2021 0408'
    }),
    new CopyWebpackPlugin({
      patterns: [
        {
          from: 'doc',
          to: './dist'
        }
      ]
    }),
    new CleanWebpackPlugin(),
    new HtmlWebpackPlugin({
      template: './index.html',
      filename: 'index.html',
    }),
  ]
}